<!DOCTYPE html>
<script src="../../../resources/gesture-util.js"></script>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>

<div id="host"></div>

<script>
var receivedMouseWheel = false;

function createInput(name) {
    var div = document.createElement('input');
    div.style.width = '100px';
    div.style.height = '100px';

    div.addEventListener('mousewheel', function(e) {
        receivedMouseWheel = true;
    });

    return div;
}

promise_test(async () => {
    var shadowRoot = host.attachShadow({ mode: 'open' });
    var shadowDiv = createInput('shadow');
    shadowRoot.appendChild(shadowDiv);

    var center = elementCenter(shadowDiv);
    await wheelTick(0, -1, center);

    assert_true(receivedMouseWheel);
}, "Verify a mousewheel event is fired when wheeling over shadow div element.");
</script>
